<template>
	<div>
		<h1>这是Home组件</h1>
		<h2>msg:{{msg}}</h2>
		<button @click="setMsg()">修改msg</button>
	</div>
</template>

<script lang="ts">
	//defineComponent 启用类型校验
	import {defineComponent} from 'vue'
	/* ts中类型校验  | 联合写法,title*/
	// let msg:string|number = "这是一个msg",
	
	//使用接口约束类型
	interface user{
		msg:string|number,
		name:string,
		count:0,
		des:string
	}
	// let users:user = {
	// 	msg:"标题",
	// 	name:"追梦",
	// 	count:0,
	// 	des:""
	// }
	let users = {
		msg:"标题",
		name:"追梦",
		count:0,
		des:""
	} as user
	
	export default defineComponent({
		data(){
			return users
		},
		methods:{
			setMsg():string{
				 return this.msg = "123"
			}
		}
	})
</script>

<style>
</style>
